<template>
  <i class="dh-icon" :class="{ [`dh-icon--${type}`]: type }" :style="colorStyle" v-bind="$attrs">
    <font-awesome-icon v-bind="filterProps"></font-awesome-icon>
  </i>
</template>

<script setup lang="ts">
import { computed } from "vue";
import type { IconProps } from "./type";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
import { omit } from "lodash-es";
defineOptions({
  name: "DhIcon",
  //禁止透传
  inheritAttrs: false,
});
const props = defineProps<IconProps>();
let filterProps = computed(()=>omit(props, ["color", "type"]));
let colorStyle = computed(()=>{
  return props.color ? {color:props.color} : {}
})
</script>

<style scoped></style>
